{extend name="default:layout:base" /}

{block name="main"}
<table id="{$controller}-table" class="layui-table" lay-filter="{$controller}-table"></table>

<script type="text/html" id="top-btns">
    <a class="layui-btn layui-btn-sm layui-btn-normal" lay-event="add">新增</a>
    <a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete">批量删除</a>
</script>

<!-- 右侧操作 -->
<script type="text/html" id="right-btns">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
</script>

<script>
    layui.use(['treeTable', 'miniTab'], function () {
        var $ = layui.jquery
        ,treeTable = layui.treeTable
            ,miniTab = layui.miniTab;

        // 渲染表格
        layer.load(2);
        var tt = treeTable.render({
            title: '菜单权限表'
            ,elem: '#{$controller}-table'
            ,toolbar: '#top-btns'
            ,method: 'post'
            ,url: '{:url("index")}'
            , page: false
            , tree: {
                iconIndex: 1,           // 折叠图标显示在第几列
                isPidData: true,        // 是否是id、pid形式数据
                idName: 'id',  // id字段名称
                pidName: 'pid'     // pid字段名称
            },
            cols: [[
                //{type: 'numbers'},
                {field: 'id', minWidth: 40, type: 'checkbox'},
                {field: 'title', minWidth: 200, title: '名称'},
                {field: 'href', title: 'Url'},
                {field: 'sort', minWidth: 80, align: 'center', title: '排序号'},
                {
                    field: 'type', width: 80, align: 'center', title: '类型', templet: function (d) {
                        if (d.type == 1) {
                            return '<span class="layui-badge-rim">菜单</span>';
                        } else {
                            return '<span class="layui-badge layui-bg-gray">权限</span>';
                        }
                    }
                },
                {templet: '#right-btns', width: 120, align: 'center', title: '操作'}
            ]],
            done: function (res) {
                tt.expandAll();
                layer.closeAll('loading');
            }
            ,parseData: function(res){ //res 即为原始返回的数据
                return {
                    "code": Math.abs(res.code - 1), //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.list //解析数据列表
                };
            }
            , text: {
                none: kyDicts.emptyData
            }
        });

        //监听顶部按钮
        treeTable.on('toolbar({$controller}-table)', function (obj) {
            switch (obj.event) {
                case 'add':
                    var index = layer.open({
                        title: '新增菜单',
                        type: 2,
                        shade: 0.2,
                        maxmin:true,
                        shadeClose: true,
                        area: ['95%', '95%'],
                        content: '{:url("add")}',
                    });
                    $(window).on("resize", function () {
                        layer.full(index);
                    });
                    return false;
                case 'delete':
                    var href='{:url("setStatus", ["status" => "delete"])}';
                    layer.confirm('确认删除?', function(index){
                        var ids = tt.checkStatus('{$controller}-table').map((item,index) => {return item.id});
                        var params = {ids: ids};
                        requestPost(href, params, function (res) {
                            tt.refresh();  // 刷新(异步模式)
                        });
                        layer.close(index);
                    });
                    break;
            }
        });

        //监听操作栏按钮
        treeTable.on('tool({$controller}-table)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;

            if (layEvent === 'delete') {
                layer.confirm('确认删除?', function(index){
                    var url = "{:url('setStatus')}"
                        , params = {ids: data.id, status: 'delete'};
                  window.requestPost(url, params, function (res) {
                        tt.refresh();  // 刷新(异步模式)
                    });
                    layer.close(index);
                });
            } else if (layEvent === 'edit') {
                var index = layer.open({
                    title: '编辑菜单',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: true,
                    area: ['95%', '95%'],
                    content: '{:url("edit")}?id=' + data.id,
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            }
        });
    });
</script>
{/block}